<template>
	<view class="app">
		<view v-for="(item, index) in list" :key="index">
			<view class="box b-b" @click="gotodetails(item.id)">
				<view class="left">
					<view class="up">
						<!-- <text class="up-note clamp" v-if="type == 1">{{ item.note }}</text> -->
						<text class="up-note clamp">{{ item.blind_name }}-{{ item.blind_number }}</text>
						<!-- <text v-if="item.ExStr1 != '' && item.ExStr4=='true'" class="up-note clamp">{{item.ExStr1 + "-" + item.ExStr2}}</text> -->
						<!-- <text v-if="item.ExStr1 != '' && item.ExStr4=='false'" class="up-note clamp">{{item.ExStr2 + '-' + item.ExStr1}}</text> -->
					</view>
					<view class="down-time">
						<text class="">{{ item.date}}</text>
						<!-- <text class="" v-if="type == 2">余额 ￥{{ item.now_money }}</text> -->
					</view>
				</view>
				<view class="right">
					<text class="right-yue" >参与金额:{{ item.money }}</text>
					<!-- <text v-if="item.ExStr4=='true'" class="right-jine-add">{{item.ExStr3}}</text> -->
					<text class="right-jine-add" v-if="item.state!=3">福卡类型：{{ item.leixing }}</text>
					<!-- <text :class="item.state == 1 ? 'right-jine-cut' : 'right-jine-add'" v-if="type == 2">{{ item.state == 1 ? '收入' : '支出' }}</text> -->
					<!-- <text v-if="item.ExStr4=='false'" class="right-jine-cut">{{item.ExStr3}}</text> -->
					<!-- <text v-if="type == 1" class="right-yue">幸福余额 {{item.FromUser == userInfo.userid ? item.FromYue1 : item.ToYue1 }}</text> -->
					
					
					<!-- <text v-if="type == 2" class="right-yue">店商余额 {{item.FromUser == userInfo.userid ? item.FromYue2 : item.ToYue2 }}</text> -->
				</view>
			</view>
		</view>
		<uni-load-more :status="loadingType"></uni-load-more>
		<!-- <uni-load-more :status="loadingType"></uni-load-more> -->
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
import { mapState } from 'vuex';
export default {
	components: {
		uniLoadMore
	},
	data() {
		return {
			list: [],
			jingmiao_id: '',
			type: '',
			loadingType: 'more',
			pageindex: 1
		};
	},
	onLoad() {
		
		this.loadData();
	},
	onReachBottom() {
		if (this.loadingType == 'more') {
			this.pageindex++;
			this.loadData();
		}
		if (this.loadingType == 'nomore') {
			return;
		}
	},
	computed: {
		...mapState(['hasLogin', 'userInfo'])
	},
	methods: {
		gotodetails(id){
			uni.showLoading({
				title:"",
				mask:true
			})
		
			uni.navigateTo({
				url: '/pages/user/blindbox/details?orderCode=' + id,
				complete() {
					uni.hideLoading()
				}
			})
			
		},
		loadData() {
			this.$api.post({
				url: '/wanlshop/blindbox/join_blindlist',
				data:{
					// member_id: this.userInfo.centons.member_id,
					pageindex: this.pageindex
				},
				success: res => {
					let list = res
					this.list = this.list.concat(list);
					this.loadingType = this.list.length < 20 * this.pageindex ? 'nomore' : 'more';
				}
			});
		}
	},
	filters: {
		formatDate: function(value) {
			let date = new Date(parseInt(value + '000'));
			//时间戳为10位需*1000，时间戳为13位的话不需乘1000
			let y = date.getFullYear();
			let MM = date.getMonth() + 1;
			MM = MM < 10 ? '0' + MM : MM; //月补0
			let d = date.getDate();
			d = d < 10 ? '0' + d : d; //天补0
			let h = date.getHours();
			h = h < 10 ? '0' + h : h; //小时补0
			let m = date.getMinutes();
			m = m < 10 ? '0' + m : m; //分钟补0
			let s = date.getSeconds();
			s = s < 10 ? '0' + s : s; //秒补0
			return y + '-' + MM + '-' + d + ' ' + h + ':' + m;
		}
	}
};
</script>

<style lang="scss">
.app {
	display: flex;
	flex-direction: column;
	padding: 0 50upx;
}
.box {
	display: flex;
	padding: 50upx 0;
	position: relative;
}
.left {
	display: flex;
	flex-direction: column;
	width: 50%;
}
.up .down {
	float: left;
}
.up-note {
	font-size: 32upx;
}
.down-time {
	font-size: 32upx;
	// color: $font-color-light;
}
.right-jine-add {
	font-size: 32upx;
	color: $base-color;
	float: right;
}
.right-jine-cut {
	font-size: 32upx;
	color: #07c160;
	float: right;
}
.right-yue {
	font-size: 32upx;
	color: $font-color-light;
	float: right;
}
.right {
	display: flex;
	flex-direction: column;
	text-align: right;
	width: 50%;
}
</style>
